@charset "utf-8";
canvas{position:absolute; margin-top:-1000em;}



/*2020*/

.avantB{font-family: 'avant';}
.avant{font-family: 'avantB';}
.clh{clear: both; height: 0; font-size: 0;}



/*navbar*/
			.navbar {
				height:72px;
				/*box-shadow: 0 1px 0 0 rgba(0, 0, 0, .06);
				background-color: #FFF;*/
				position:fixed;
				z-index: 5;
				width: 100%;
				color:#FFF;
				margin-top: 30px;
			}

			.navbar__left {
				position: absolute;
				left: 0;
				top: 0;
				padding-left: 4.7%;
				height: 72px
			}

			.navbar__left:after {
				content: "";
				width: 0;
				display: inline-block;
				height: 100%;
				vertical-align: middle
			}

			.navbar__center {
				height: 72px;
				padding-left: 50px;
				padding-right: 8%;
				text-align: right;
			}

			.navbar__right {
				position: absolute;
				right: 0;
				top: 0;
				padding-right: 4.7%;
				height: 140px
			}

			.navbar__right:after {
				content: "";
				width: 0;
				height: 100%
			}

			.home-link,
			.navbar__right:after {
				display: inline-block;
				vertical-align: middle
			}

			.lang-tab {
				display: inline-block;
				vertical-align: middle;
				color: #a3a3a3;
				font-size: 0;
				margin-right: 20px
			}

			.lang-tab:last-child {
				margin-right: 0
			}

			.lang-tab__item {
				display: inline-block;
				font-size: 14px;
				line-height: 12px;
				cursor: pointer
			}

			.lang-tab__item.selected {
				color: #222;
				font-weight: 600
			}

			.lang-tab__item:first-child {
				padding-right: 10px;
				border-right: 1px solid #e4e8eb
			}

			.lang-tab__item:last-child {
				padding-left: 10px
			}

			.logo__wrp {
				font-size: 0;
				display: inline;
			}
			.home-link {
				font-size: 0;
			}
			.logo__icon {
				display: inline-block;
				width: 90px;
				height: 36px;
			}
			.lgcolor{fill:#FFF;height: 100%;}
			.dot {
				display: inline-block;
				vertical-align: middle;
				margin: 0 10px;
			}

			@media (max-width:1080px) {

				.logo__icon,
				.navbar .logo__icon {
					width: 70px;
					height: 32px
				}
			}

			.nav-links {
				font-size: 0;
			}

			.nav-item {
				display: inline-block;
				vertical-align: middle;
				padding: 0 28px
			}
			
			.nav-item .nav-link {
				color: #FFF;
			}
			.nav-item.selected>.nav-link {
				color: #FFF;
				font-weight: 500
			}
			

			.nav-item>.nav-link {
				display: block;
				height: 72px;
				line-height: 72px;
				font-size: 16px;
				position: relative
			}

			.nav-item>.nav-link:after {
				content: "";
				position: absolute;
				display: block;
				width: 60px;
				height: 1px;
				background-color: #FFF;
				border-radius: 2px;
				left: 50%;
				margin-left: -30px;
				bottom: 25%;
				opacity: 0;
				transform: scaleX(0);
				transition: all .2s cubic-bezier(.18, .89, .17, .88), opacity .15s ease
			}

			.nav-item>.nav-link:hover:after {
				opacity: 1;
				transform: scaleX(1)
			}
			.nav-item.selected>.nav-link:after {
				opacity: 1;
				bottom: 75%;
				transform: scaleX(1)
			}
			
body.nav-black .navbar {
				box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .10);
				background-color: rgba(255,255,255,0.9);
				color:#999;
				margin-top: 0;
				backdrop-filter: blur(8px);
}

body.nav-black .lgcolor{fill:#000;height: 100%;}
body.nav-black .nav-item>.nav-link {color: #222;}
body.nav-black .nav-item.selected>.nav-link {color: #000;}
body.nav-black .nav-item>.nav-link:after {background-color: #000;}


			@media (min-width:1080px) and (max-width:1680px) {
				.navbar_with-link {
					display: flex
				}

				.navbar_with-link .navbar__left {
					position: relative;
					white-space: nowrap
				}

				.navbar_with-link .navbar__center {
					flex: 1;
					/*padding: 0*/
				}

				.navbar_with-link .navbar__right {
					position: relative;
					box-sizing: border-box;
					display: flex;
					align-items: center
				}

			}

			@media (min-width:1080px) {
				.navbar__center .nav-links {
					white-space: nowrap
				}
			}

			@media (max-width:1080px) {
				.navbar {
					display: flex;
					height: 56px;
					box-shadow: none;
					position: fixed;
					top: 0;
					left: 0;
					right: 0
				}

				.navbar__left {
					position: static;
					height: auto;
					padding-left: 16px
				}

				.navbar__center {
					display: none !important;
					position: static;
					height: auto;
					padding: 0;
					flex: 1;
					padding-right: 16px;
					text-align: right;

				}

				.navbar__center .nav-item {
					display: none
				}

				.navbar__center .nav-item.selected {
					display: block;
					padding: 0
				}

				

				.navbar__right {
					display: none !important
				}

			}
@media screen and (max-width:768px) {

	.navbar {
		margin-top: 10px;
	}
}



/*.p-nav__open*/

@keyframes navShadow {
	0% {
		transform: translateX(0)
	}

	to {
		transform: translateX(44px)
	}
}
.p-nav__open {
	letter-spacing: 2.5px
}

.p-nav__close,
.p-nav__open {
	position:fixed;
	color: #FFF;
	top: 27px;
	right: 4.7%;
	height: 19px;
	font-size: 12px;
	font-weight: 700;
	line-height: 22px;
	margin-top: 30px;
	cursor: pointer
}

@media screen and (max-width:768px) {

	.p-nav__close,
	.p-nav__open {
		top: 33px;
		right: 32px;
		height: 23px;
		width: 23px
	}
}

.p-nav__close>p,
.p-nav__open>p {
	transition: .5s cubic-bezier(.08, .92, .35, 1)
}
	
	.p-nav__open>p {
		display: none
	}
@media screen and (max-width:768px) {

	.p-nav__close>p,
	.p-nav__open>p {
		display: none
	}
}

.p-nav__open {
	z-index: 22;
	width: 76px;
	display: block
}

@media screen and (max-width:768px) {
	.p-nav__open,.p-nav__close {
		width: 25px;
		top: 17px;
		margin-top: 10px;
	}
}

.p-nav__open::after {
	z-index: -1;
	right: -50px;
	top: -58px;
	width: 175px;
	height: 135px;
	transition: opacity .3s;
	display: none
}

@media screen and (max-width:768px) {
	.p-nav__open::after {
		top: -33px;
		right: -32px;
		width: 89px;
		height: 89px;
		display: none
	}
}



.p-nav__open>span {
	position: absolute;
	right: 0;
	width: 27px;
	height: 2px;
	overflow: hidden;
	transition: .3s
}

@media screen and (max-width:768px) {
	.p-nav__open>span {
		width: 35px;
		height: 2px
	}
}

.p-nav__open>span>span {
	position: absolute;
	z-index: 1;
	left: -8px;
	top: 0;
	height: 100%;
	width: 3px;
	background-color: #191919;
	transition: opacity .3s, background-color .3s
}

.p-nav__open>span::after,
.p-nav__open>span::before {
	content: '';
	position: absolute;
	left: -30px;
	top: 0;
	height: 100%;
	width: 100%;
	background-color: #fff
}

.p-nav__open>span::after {
	left: 0%
}

.p-nav__open>span:nth-child(2) {
	top: 0
}

.p-nav__open>span:nth-child(2)::after,
.p-nav__open>span:nth-child(2)::before {
	transition: transform .5s cubic-bezier(.08, .92, .35, 1), background-color .3s
}

.p-nav__open>span:nth-child(2)>span {
	animation: navShadow 1.3s cubic-bezier(.79, .17, .15, .96) infinite
}

.p-nav__open>span:nth-child(3) {
	top: 9px
}

.p-nav__open>span:nth-child(3)::after,
.p-nav__open>span:nth-child(3)::before {
	transition: transform .5s .05s cubic-bezier(.08, .92, .35, 1), background-color .3s
}

.p-nav__open>span:nth-child(3)>span {
	animation: navShadow 1.3s .1s cubic-bezier(.79, .17, .15, .96) infinite
}

@media screen and (max-width:768px) {
	.p-nav__open>span:nth-child(3) {
		top: 11px
	}
}

.p-nav__open>span:nth-child(4) {
	bottom: 0
}

.p-nav__open>span:nth-child(4)::after,
.p-nav__open>span:nth-child(4)::before {
	transition: transform .5s .1s cubic-bezier(.08, .92, .35, 1), background-color .3s
}

.p-nav__open>span:nth-child(4)>span {
	animation: navShadow 1.3s .2s cubic-bezier(.79, .17, .15, .96) infinite
}


@media screen and (min-width:769px) {

	.p-nav__open:hover>span::after,
	.p-nav__open:hover>span::before {
		transform: translateX(25px)
	}

	.p-nav__open:hover>span>span {
		opacity: 0
	}

	.p-nav__open:hover>span:nth-child(2) {
		transform: translate3d(0, 2px, 0)
	}

	.p-nav__open:hover>span:nth-child(4) {
		transform: translate3d(0, -2px, 0)
	}
}



.p-nav__close {
	z-index: 12;
	width: 140px;
	display: block;
	letter-spacing: 3.3px
}

@media screen and (max-width:768px) {
	.p-nav__close {
		width: 23px
	}
}

.p-nav__close>span {
	position: absolute;
	right: 0;
	width: 25px;
	height: 1px;
	overflow: hidden;
	transition: .5s cubic-bezier(.08, .92, .35, 1);
	transform-origin: right
}

@media screen and (max-width:768px) {
	.p-nav__close>span {
		width: 30px
	}
}

.p-nav__close>span>span {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	background: #fff;
	transform-origin: left;
	transition: .7s cubic-bezier(.08, .92, .35, 1);
	transform: translate3d(0, 0, 0) scaleX(1)
}

.p-nav__close>span:nth-child(2) {
	top: 1px;
	transform: translateX(0) rotate(-46deg) scaleX(1)
}

.p-nav__close>span:nth-child(3) {
	bottom: -1px;
	transform: translateX(0) rotate(46deg) scaleX(1)
}

@media screen and (min-width:769px) {
	.p-nav__close:hover>p {
		transform: translateX(10px)
	}

	.p-nav__close:hover>span:nth-child(2) {
		transform: translateX(10px) rotate(-46deg) scaleX(.8)
	}

	.p-nav__close:hover>span:nth-child(3) {
		transform: translateX(10px) rotate(46deg) scaleX(.8)
	}

	.p-nav__close:hover>span>span {
		transform: translate3d(0, 0, 0) scaleX(.4)
	}
}


.p-nav__open {
	opacity: 1;
	pointer-events: all;
	transition: .4s 0s;
	z-index: 20;
}

.p-nav__close {
	pointer-events: none;
	opacity: 0;
	transform-origin: center;
	transition: .2s
}

@media screen and (max-width:768px) {
	.p-nav__close {
		transform: translateX(0)
	}

	.p-nav__close>span:nth-child(2) {
		transform: translateX(0) rotate(-46deg) scaleX(0)
	}

	.p-nav__close>span:nth-child(3) {
		transform: translateX(0) rotate(46deg) scaleX(0)
	}
}

.p-nav__close p {
	opacity: 0;
	transform: translateX(10px);
	transition: transform 0s .5s, opacity .2s
}

body.is-navOpen .p-nav__open {
	opacity: 0;
	transition: .4s;
	pointer-events: none
}

body.is-navOpen .p-nav__close {
	pointer-events: all;
	opacity: 1;
	transform: translateX(0);
	transition: transform .4s .35s cubic-bezier(.79, .17, .15, .96), opacity .3s .45s
}

@media screen and (max-width:768px) {
	body.is-navOpen .p-nav__close {
		transition: transform .5s .65s, opacity 0s
	}

	body.is-navOpen .p-nav__close>span {
		transition: .5s .65s
	}

	body.is-navOpen .p-nav__close>span:nth-child(2) {
		transform: translateX(0) rotate(-46deg) scaleX(1);
		transition: .3s .6s
	}

	body.is-navOpen .p-nav__close>span:nth-child(3) {
		transform: translateX(0) rotate(46deg) scaleX(1);
		transition: .3s .7s
	}
}

body.is-navOpen .p-nav__close p {
	opacity: 1;
	transform: translateX(0);
	transition: .3s .45s
}


body.nav-black .p-nav__open {
	color: #000;
	margin-top: 0;
	
}
body.nav-black .p-nav__open>span::after,
body.nav-black .p-nav__open>span::before {
	background-color: #191919
}

.p-nav__SPentry.enter-black .p-nav__SPentry__text span {
	color: #191919
}

body.nav-black .p-nav__open>span>span {
	background-color: #fff
}

body.nav-black .p-nav__logo>a>p,
body.nav-black .p-nav__open>p {
	color: #191919 !important
}

body.nav-black .p-nav__logo>a>svg {
	fill: #191919
}
	




/*mobile-nav*/
.mobile-nav-bg:before{width:0;height:0;border-radius:20px;content:"";position:absolute;top:0;right: 0;-webkit-transform: translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);-webkit-transition-duration:0.66s;transition-duration:0.66s;-webkit-transition-timing-function:swing;transition-timing-function:swing;z-index: 10;}

.mobile-nav{position:fixed;top:10%;left:0;width:100%;height:100%;z-index:15;-webkit-transition-duration:0.66s;transition-duration:0.66s;-webkit-transition-timing-function:swing;transition-timing-function:swing;-webkit-transform:translateY(100%);transform:translateY(100%);line-height:2;}
.mobile-nav ul li {padding: 10px 50px;}
.mobile-nav ul li .vlk{display:block;text-align:center;color:white;text-decoration:none;font-size:32px;-webkit-transition-duration:0.25s;transition-duration:0.25s;line-height: 1.3;padding: 15px 0;}
.mobile-nav ul li .vlk:hover{border-bottom: 1px solid #666;}
.mobile-nav ul li .vlk i{display:block;font-size:0.7em;font-style: normal; letter-spacing: 3px;}
body.is-navOpen .lower-screen{-webkit-transform:translateY(60px);transform:translateY(60px);transition-duration:0.25s;-webkit-transition-duration:0.25s;}
body.is-navOpen .mobile-nav{-webkit-transform:translateY(0);transform:translateY(0);}
body.is-navOpen .mobile-nav-bg:before{position:fixed;top:0;right:-2000px;width:4000px;height:5000px;border-radius:0%;background-color:rgba(30,30,30,0.9);}

@media screen and (max-width:768px) {
	.mobile-nav ul li {padding: 10px 10%;}
	.mobile-nav ul li .vlk{font-size:22px;text-align:left;}
	.mobile-nav ul li .vlk i{font-size:0.7em;}
}



/*底部导航*/
.mui-bar-tab{
	    position: fixed;
	    z-index: 10;
	    right: 0;
	    left: 0;

	    background-color: #FFF;
	    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .55);
	            box-shadow: 0 0 1px rgba(0, 0, 0, .55);
	
	    -webkit-backface-visibility: hidden;
	            backface-visibility: hidden;
    bottom: 0;

    display: none;

    width: 100%;
    height: 60px;
    padding: 0;

    table-layout: fixed;

    border-top: 0;
    border-bottom: 0;

    -webkit-touch-callout: none;
	line-height: 1.3;
}
	@media screen and (max-width:768px) {

	.mui-bar-tab{ display: table;}
	
	}
.mui-bar-tab .mui-tab-item
{
    display: table-cell;
    overflow: hidden;

    width: 1%;
    height: 50px;

    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis;
	position: relative;
    color: #444;
}
.mui-bar-tab .mui-tab-item.mui-active
{
    color: #0050ff;
}
.mui-bar-tab .mui-tab-item.mui-active::after
{
	content: '';
	position: absolute;
	left: 50%;
	top:30%;
	height:16px;
	width:16px;
	background-color: rgba(0,187,157,0.3);
	border-radius: 100%;
	z-index: 1;
}
.mui-bar-tab .mui-tab-item:last-child::before
{
	content: '3';
	position: absolute;
	left: 50%;
	top:10%;
	height:12px;
	width:12px;
	font-size: 10px;
	line-height: 12px;
	color: #FFF;
	background-color:#FF0000;
	border-radius: 100%;
	font-family: 'avant';
	z-index: 1;
}
.mui-bar-tab .mui-tab-item .mui-icon
{
    top: 3px;

    width: 24px;
    height: 24px;
    padding-top: 0;
    padding-bottom: 0;
	font-size: 26px;
}
.mui-bar-tab .mui-tab-item .mui-icon ~ .mui-tab-label
{
    font-size: 12px;

    display: block;
    overflow: hidden;

    text-overflow: ellipsis;
}
.mui-bar-tab .mui-tab-item .mui-icon:active
{
    background: none;
}	





.mobtop{ color:#FFF; line-height:1.6; position:relative; text-align:center; width:100%; overflow:hidden;height: 500px;background:#0050ff url('img/s5_k_ico.svg') center 10% no-repeat; background-size:auto 240%;}
.mobtop .contentinfo{ width:100%;position:absolute; top:50%; margin-top:-45px; text-align:center; z-index:1; overflow:hidden; left:0;}
.mobtop .contentinfo h2{color:#FFF; font-size:42px; font-weight:bold; text-align: center;}
.mobtop .contentinfo h2::after{height: 2px; width: 30px; display: block; content: ''; background-color: #FFF; margin: 12px auto 20px;}

.mobtop .contentinfo i{font-size:18px; line-height:1;}
.mobtop .contentinfo p{font-size:14px; color: rgba(255,255,255,0);  transition: all 0.6s;}
.mobtop .contentinfo:hover p{color: rgba(255,255,255,0.6);}
.mobtop em{ display:block; width:15%; margin:0 auto; height:2em; display:none; border-bottom:1px solid #FFF;}

/*case*/
.mobtop.tb105{background-color:#4700ff;background-image:url('img/s5_k_ico.svg');}
.mobtop.tb148{background-color:#2b3b4e;background-image: url('img/s4_k_ico.svg');}
.mobtop.tb150{background-color:#00af7e;background-image: url('img/s2_k_ico.svg');}
.mobtop.tb154{background-color:#0050ff;background-image: url('img/s3_k_ico.svg');}


/*service*/
.mobtop.tb142{background-color:#de333c;background-image: url('img/s6_k_ico.svg');background-position: center 35%;}

/*about*/
.mobtop.tb93{background-image: url('img/s1_k_ico.svg');background-position: center 40%;}
.mobtop.tb93{background-image: url('img/s7_k_ico.svg');background-position: center 40%;}
.mobtop.tb93{background-image: url('img/s8_k_ico.svg');background-position: center 90%;}

 @media screen and (max-width:768px) {
	
	.mobtop{ height: 280px;background-size:auto 240%;}
	.mobtop .contentinfo{top:50%; margin-top:-15px; }
	.mobtop .contentinfo h2{font-size:24px; letter-spacing: 3px;}
	.mobtop .contentinfo i{font-size:14px; line-height:1;}
	.mobtop p{ display:none;}
 }
 
 
/*2020 end*/





 
.bottom1{ background:#FFF; width:100%;}
.bottom1 .p1{ color:#2E2E2E; font-size:32px; padding-top:50px; padding-bottom:20px;}
.bottom1 .p2{ color:#999; padding:30px 0 50px 0;}
.bottom1 input{ padding-left:1%; margin-right:1%;}
.bottom1 .input1{ background-color:#F0F0F0; border:none; width:17%; height:59px; line-height:59px; font-size:16px; color:#333;}
.bottom1 .input2{ background-color:#F0F0F0; border:none; width:47%; height:59px; line-height:59px; font-size:16px; color:#333;}
.bottom1 .submit{background-color:#0050ff; border:none; width:15%; height:59px; line-height:59px; font-size:16px; color:#FFF; cursor:pointer;}
.bottom1 .submit:hover {
	color:#FFF;
	background:#49D160;
}

.bottom2 a{ color:#FFF;}
.bottom2 a:hover{ text-decoration:underline;}
.bottom2{ width:100%; background-color:#111; color:#FFF; line-height:1.8}
.bottom2 ul li{ float:left; width:33%;}
.bottom2 h3{ font-size:20px; font-weight:normal; padding-bottom:20px; padding-top:50px;}
.bottom2 p{ font-size:16px;}
.bottom2 span{ font-size:12px; display:block;}
.bottom2 .fukuan{ width:160px; height:43px; background-color:#0050ff;line-height:43px; font-size:14px; text-align:center; margin-top:15px; }
.bottom2 .fukuan:hover {
	color:#FFF;
	background:#49D160;
	text-decoration:none;
}

.bottom2 .tell{ font-size:32px; line-height:1;}
.bottom2 .qq3{ padding-top:10px;}
.bottom2 .qq1{ background:url(/Public/pin2016/qq.png) no-repeat; width:55px; height:55px; display:inline-block; margin-top:50px; margin-right:10px;}
.bottom2 .qq2{ background:url(/Public/pin2016/qq2.png) no-repeat; width:55px; height:55px; display:inline-block; margin-top:50px;}
.bottom2 .xx{ padding-top:150px; padding-bottom:60px; font-size:12px;color:#BABABA;}
.bottom2 .xx .xx1{ float:left;}
.bottom2 .xx .xx2{ float:right;}

.ct9,a.ct9,.ct9 a,.ct9 a:visited{ color:#BABABA;}
a.ct9:hover,.ct9 a:hover{ color:#999;}

.btnmore {
	background: #0050ff;
	width: 270px;
	line-height:50px;
	text-align: center;
	margin: 20px auto;
	color: #FFF;
	display:block;
	font-size: 16px;
	border-left:0px;
	border-top:0px;
}
.btnmore:hover {
	color:#FFF;
	background:#49D160;
}

/*2020--------------*/
.h_case_tit{background:#000;text-align:center;}
.h_case_tit img{max-width:100%;}


/*案例--------------*/
@-webkit-keyframes playLR{
			  0% {transform:translate(0px,0);}
              50% {transform:translate(-10px,0);}
              100% {transform:translate(0px,0);}
}

.case-content{padding:10px;}
.case-content li{width: 25%; padding:10px;float: left;}
.case-content li .cbox{border-radius:4px;position:relative;overflow:hidden;}
.case-content li .pic{display: block;background:#dedede url("../pin2016/loading2.gif") no-repeat center;
padding-bottom:75%;
padding-bottom:56%;
position:relative; overflow:hidden;}
.case-content li .pic img{height: 100%; display:block;background:#dedede url("../pin2016/loading2.gif") no-repeat center; position: absolute;}
.case-content li .pic em{width: 100%;height:100%;background:rgba(0,0,0,0.65) url("img/case_over.svg") no-repeat center;background-size:100%; position: absolute;left:0px;top:0px;z-index:2;opacity:0;}
.case-content li .pic i{width: 18px;height:60px;background:url("img/W.png") no-repeat center top;background-size:100% auto; position: absolute;right:20px;top:-60px;z-index:3;opacity:1;}
.case-content li .hd{min-height: 40px; font-size:16px;background:#FFF;position:relative;padding-bottom:32%;}
.case-content li .hd span{text-overflow:ellipsis; white-space:nowrap; overflow:hidden;border-bottom:1px solid #FFF;padding-right:10px;position: absolute;top:18px;left:20px;}
.case-content li .hd a{color: #000;}
.case-content li .hd a:hover span{border-bottom:1px solid #000;}
.case-content li .hd .italic{display:block;padding-top:15px;line-height:1.5;position: absolute;bottom:20px;left:20px;}
.case-content li .hd .color{position: absolute;top:23px;right:20px;}
.case-content li .hd .color em{width:16px;height:16px;background:#FFF;border:8px solid #DDD;border-radius:10px;float:left;margin-left:8px;}
.case-content li .hd .arw{position: absolute;bottom:23px;right:70px;width:50%;height:20px;background:url("img/arw.svg") no-repeat center right;background-size:auto 50% ;opacity:0;}


.case-content li:hover .cbox{transform:translate(0,-5px);box-shadow:0 15px 25px rgba(0, 0, 0, 0.12);z-index:10;}
.case-content li:hover em{opacity:1;}
.case-content li:hover .hd .color em{border-width:3px;}
.case-content li:hover .hd .color em:nth-of-type(2){transition-delay: 0.2s;}
.case-content li:hover .hd .color em:nth-of-type(3){transition-delay: 0.4s;}
.case-content li:hover .pic img{ transition: all 1.2s;transform:scale(1.2,1.2);}
.case-content li:hover .hd .arw{right:20px;opacity:1;transition: all 0.6s;transition-delay: .4s;transition-timing-function: ease-out;}
.case-content li:hover .hd .arw:hover{animation: playLR 0.6s 20 ease-in-out;}


.case-content li.wt2{width: 50%; padding:0px;}
.case-content li.wt2 .cbox{border-radius:0px;}
.case-content li.wt2:hover .cbox{transform:translate(0,0);}
.case-content li.wt2 .pic{width:64%;
padding-bottom:48%;
padding-bottom:36%;
float:left;}
.case-content li.wt2 .hd{width:36%;float:left;
padding-bottom:48%;
padding-bottom:36%;
}
.case-content li.wt2 .hd span{top:13%;left:13%;}
.case-content li.wt2 .hd .italic{top:25%;left:13%;}
.case-content li.wt2 .hd .color{top:auto;bottom:13%;left:13%;}
.case-content li.wt2 .hd .color em{margin:0 8px 0 0;}
.case-content li.wt2 .hd .arw{bottom:13%;}


.case-content li.wt2:nth-child(odd){padding-left:10px;}
.case-content li.wt2:nth-child(even){padding-right:10px;}

.case-content li.wt2:nth-of-type(4n+3) .pic,.case-content li.wt2:nth-of-type(4n+4) .pic{float:right;}

.case-content li.wt2:nth-child(3),.case-content li.wt2:nth-child(4){padding-bottom:10px;}




.case-title{padding-top: 50px;padding-bottom: 40px;}
.case-title a{margin:0 30px; color:#000; font-size:16px;padding:5px;display:inline-block;border-bottom:1px solid rgba(255,255,255,0);}
.case-title a.hover,.case-title a:hover{color:#000;}
.case-title a.hover{font-weight: bold;}

.case-title a::after{height: 1px; width: 0px; display: block; content: ''; margin-top: 1px; background-color: #000;transition: all 0.6s;}
.case-title a.hover::after,.case-title a:hover::after{width: 100%; }


 @media screen and (max-width:768px) {
	.case-title{ padding:20px 5px 0px;}
	.case-title a{margin:5px 1%; width: 46%;font-size:14px; padding:7px 0;display:inline-block;border:1px solid #FFF; background-color: #FFF;}
	.case-title a.hover,.case-title a:hover{color:#FFF;border:1px solid #000;background-color: #000;}
	.case-title a::after{display: none; }
 }

.case-loading{ text-align:center; margin:0 0 50px; width:100%;display:none;}



@media only screen and (max-width:1780px){
/*1780 start*/
	.case-content li{width: 25%;}


/*1780 end*/
}

@media only screen and (max-width:1400px){
/*1400 start*/
	.case-content li{width: 33.333%;}

/*1400 end*/
}

@media only screen and (max-width:900px){
/*900 start*/
	.case-content li{width: 50%;}

	.case-content li.wt2{width: 100%; padding-left:10px;padding-right:10px;}
	.case-content li.wt2:nth-of-type(4n+3) .pic,.case-content li.wt2:nth-of-type(4n+4) .pic{float:left;}
	.case-content li.wt2:nth-child(odd) .pic{float:right;}
	.case-content li.wt2:nth-child(3){padding-bottom:0px;}

	
/*900 end*/
}

@media only screen and (max-width:720px){
/*720 start*/
	
	.case-content li{width:100%;padding:8px 5px;}
	.case-content li .italic{ display:block; font-size:8px;}
	.case-content li .hd .color em{height:10px;width:10px;border-width:5px;}
	.case-content li .hd .arw{height:15px;}
	.case-content li.wt2{padding-left:5px;padding-right:5px;}
	.case-content li.wt2:nth-child(odd){padding-left:5px;}
	.case-content li.wt2:nth-child(even){padding-right:5px;}


/*720 end*/
}

 
.caseinfo{ background:#FFF;

position:relative; z-index:2; max-width:1440px; margin:-100px auto 25px;}
#target-image div{ text-align:center;}
.caseinfo img{ max-width:100%; text-align:center;display:inherit;margin: 0 auto;}
.caseinfo .btnmore {
	width: 210px;
}


.caseinfotop1{ width:65%; padding-left:5%; padding-right:15%;}
.caseinfotop2{ width:35%;}
.caseinfotop i{ font-size:30px;font-family: Pincolor; padding-top:50px; display:block; }
.caseinfotop p{ font-size:16px; color:#333; padding:20px 0 70px;}
.caseinfotop span{ padding-top:20px; display:block;}
.caseinfotop .fangwen{display:inline-block; width:176px; height:34px; background:url("pin2016/s1_r2_c2.jpg") no-repeat; background-size:100% 100%; margin-top:10px;}
.caseinfobot a{ color:#444;}
.caseinfobot ul li{ float:left; width:33%;}
.caseinfobot ul li a:hover{ color:#0050ff;}
.caseinfobot ul li:nth-of-type(1){ text-align:left; padding-left:5%; padding-top:50px; }
.caseinfobot ul li:nth-of-type(2){ text-align:center; padding-top:30px;padding-bottom:30px;}
.caseinfobot ul li:nth-of-type(3){ text-align:right; padding-right:5%; padding-top:50px;}
.caseinfobot .fanhui a{ display:inline-block; width:65px; height:65px; background:url("pin2016/liebiao.png") no-repeat 0 0;}
.caseinfobot .fanhui a:hover{ background-position:0 -65px;}
.zi{ color:#BBB; margin-bottom:60px; line-height:1.5; font-size:12px;}

/***首页***/
	.fp-tableCell {
		position:relative;
	    width: 100%;
	    height: 100%;
	}
	.fp-tableCell #myVideo {
	    background-color: black;
	    background-position: center center;
	    background-size: contain;
	    bottom: 0;
	    height: 100%;
	    object-fit: cover;
	    position: absolute;
	    right: 0;
	    top: 0;
	    width: 100%;
	    z-index: 3;
	}
	.fp-tableCell .container {
		left: 0;
		position: absolute;
		top: 0;
		width: 100%;
		max-width: 100%;
		height: 100%;
		z-index: 4;
	}
	.fp-tableCell h1 {
		position: absolute;
		visibility: hidden;
	}		
	.fp-tableCell .glitch-box {
		position: absolute;
		left: 0;
		right: 0;
		margin: 0 auto;
		top: 50%;
		height: 170px;
		margin-top: -105px;
	}
	.fp-tableCell .glitch-box h4{
		font-size:90px;
		font-family:"Pincolor";
		line-height:1;
	}
	.fp-tableCell .glitch-box h3{
		font-size:75px;
		font-weight:bold;
		letter-spacing: 6px;
	}
	.fp-tableCell .glitch-box h5{
		font-size:16px;
	}
.mobtop #home_mbbg{display:none;}

#about_howto {
	padding:5px 0;
	color:#1a1a1a;
}
#about_howto li{
	display:none;
	line-height:1.3;
}
#about_howto {
	font-size:28px;
}
#about_howto .howto_en{
	font-size:16px;
}
.pincolor{font-size:75px; line-height:0.8;letter-spacing:8px; padding:50px 0 30px; color:#0050ff; font-family:Pincolor;}



/**********side-bar***********/

.side-bar{position:fixed;bottom:300px;right:0px;margin-right:-100px;width:45px;z-index:10000;font-size:14px; display:none1;}.side-bar div{margin:1px 0 0;float:right;cursor:pointer;}.side-bar div p{color:#fff;line-height:45px;}.side-bar div a{ display:block; width:110px;}.to-top{width:45px;height:45px;line-height:45px;text-align:center;background:#cbcbcb;color:#fff;font-weight:bold;position:relative;}
.side-bar strong{font-weight:bold;}
.side-bar-erweima{width:45px;height:45px;background:#888;position:relative;}
.erweima{width:390px;height:150px;display:none;position:absolute;top:-108px;left:-405px;background:#fff;border:1px solid #ccc;float:right;cursor:default !important;}
.side-bar-erweima .erweima p{line-height:20px;color:#000;text-align:center;float:left;width:130px;}
.side-bar-erweima .erweima p.con{line-height:20px;font-size:14px;text-align:left;float:left;width:335px; padding:13px 10px 10px 15px;}
.ico2{background:url(pin2016/images/barico2.png) no-repeat;}
.side-bar-erweima .arrow3{width:6px;height:11px;display:block;background:url(pin2016/images/weixin-arrow.png) no-repeat;position:absolute;right:-6px;top:122px;}
.side-bar-erweima img{width:110px;height:110px;margin:10px 10px 0px 10px;}
.side-bar-qq{width:45px;height:45px;background:#007AFF;}
.side-bar-contact{width:45px;height:45px;background:#888;}
.side-bar .ico2{width:46px;height:46px;display:block;float:left;}
.side-bar .side-bar-erweima .ico2{float:right;}
.to-top .ico2{width:12px;height:5px;position:absolute;top:-5px;left:18px;}
.side-bar-erweima .ico2{background-position:-46px -46px;}
.side-bar-erweima .ico2{background-position:-138px -46px;}
.side-bar-qq .ico2{background-position:2px -46px;}
.side-bar-contact .ico2{background-position:-92px -46px;}
.to-top .ico2{background-position:-28px -2px;}


.serlist2 .serlist21 ul li{ width:25%; float:left; }
.serlist2 .serlist21 ul li img{ display:block;}
.serlist2 .serlist22 .serlist22l,.serlist2 .serlist22 .serlist22r{ width:50%; text-align:center; padding-top:50px; padding-bottom:50px;}
.mob_tit{ font-size:28px; line-height:1.5; text-align:center; padding:60px 0 0;}
.mob_list{ width:1055px; margin:0 auto; padding:20px 0 50px;}
.mob_list ul li{ float:left; padding:8px;}
.mob_list ul li a{ display:block; width:334px; height:637px; color:#333;background:url(pin2016/sj_bg.png) no-repeat left; text-align:center;}
.mob_list ul li a:hover{ background-position:-334px 0; color:#1D8DFA;}
.mob_list ul li a h2{ font-size:27px; padding-top:140px; margin-bottom:30px;}


.mshow{ display:none;}
.w100{ width:100%;}
/*home-con*/
.home-conp{ font-size:16px;width:92%;margin:0 auto; padding-top:50px; color:#333;}
.home-con{ width:94%; margin:0 auto; padding-bottom:50px;}
.home-con ul li img{ display:block;padding-left:50px; padding-top:45px; }
.home-con ul li p{ font-size:22px; padding-left:50px; padding-top:10px;}
.home-con ul li i{ font-size:12px; display:block;padding-left:50px; padding-bottom:40px; padding-right:50px;}
.home-con ul li{float:left; width:20%;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.home-con ul li:hover{-webkit-transform:scale(1.10);-moz-transform:scale(1.10);-o-transform:scale(1.10);transform:scale(1.10);box-shadow: 0px 0px 15px rgba(0,0,0,0.2); z-index:100; color:#FFF;}
.home-con ul li a:hover{ color:#FFF;}
.home-con ul li:nth-of-type(1){ background:#FFB71F;}
.home-con ul li:nth-of-type(2){ background:#10AF5D;}
.home-con ul li:nth-of-type(3){ background:#5C259E;}
.home-con ul li:nth-of-type(4){ background:#0050ff;}
.home-con ul li:nth-of-type(5){ background:#FF5C26;}

.godown{ position:absolute; left:50%; margin-left:-22px; width:44px; bottom:6%; z-index:5; cursor:pointer;}
.godown:hover{ margin-bottom:-2px;}

@media only screen and (max-width:720px) and (min-width:0px){
	
	.home-conp{ padding-top:20px; }
	.home-con{  padding-bottom:20px;}
	.home-con ul li:nth-of-type(4){ display:none;}
	.home-con ul li{ float:left; width:50%;}
	.home-con ul li img{padding-left:20px; padding-top:20px;height:50px;}
	.home-con ul li p{ font-size:16px; padding-left:20px; padding-top:10px;}
	.home-con ul li i{ font-size:10px; padding-left:20px; padding-bottom:20px; padding-right:20px;}
}
@media only screen and (max-width:720px) and (min-width:0px){
	.side-bar{ bottom:1000em;}
	
	.fp-tableCell .glitch-box h4{
		font-size:50px;
	}
	.fp-tableCell .glitch-box h3{
		font-size:28px;
		font-weight:bold;
		padding:0 3%;
		line-height:1.2;
	}
	.fp-tableCell .glitch-box h3 span{
		display:block;
	}
	.fp-tableCell .glitch-box h5,.fp-tableCell .glitch-box h7{
		font-size:10px;
	}
	
#about_howto {
	font-size:22px;
}
#about_howto .howto_en{
	font-size:12px;
}

	.pincolor{font-size:36px; padding:30px 0 15px;}
	.mhide{display:none;}
	.mshow{ display:block;}
}

@media only screen and (max-width:720px) and (min-width:0px){

.bottom1 .p1{ font-size:18px; padding-top:20px; padding-bottom:10px;}
.bottom1 .p2{ padding:10px 0 20px 0; font-size:10px}
.bottom1 .input1{width:99%; height:45px; line-height:45px; font-size:15px; margin-bottom:10px; padding:10px;}
.bottom1 .input2{ width:99%; height:45px; line-height:45px; font-size:15px; margin-bottom:10px; padding:10px;}
.bottom1 .submit{ width:99%; height:45px; line-height:45px; font-size:16px; padding:10px;}
.bottom2 ul li{ width:100%;}
.bottom2 h3{ font-size:28px; padding-bottom:0px; padding-top:20px; font-weight:bold;}
.bottom2 p{ font-size:14px;}
.bottom2 span{ font-size:10px;}
.bottom2 .fukuan{ display:none;}
.bottom2 .tell{ font-size:24px; color:#FFF; }
.bottom2 .qq3{ padding-top:10px;}
.bottom2 .qq1{ background-size:100% 100%; width:30px; height:30px;  margin-top:40px; margin-right:10px;}
.bottom2 .qq2{ background-size:100% 100%; width:30px; height:30px;  margin-top:40px; margin-right:10px;}
.bottom2 .xx{ padding-top:50px; padding-bottom:30px; font-size:10px; }
.bottom2 .xx .xx2{ float:left;}
.bottom2 .xx .ct9{ display:none;}

.caseinfo{margin-top:-15px; margin-bottom:20px; width:92%;}
.caseinfo h2{ padding:20px 5% 0 5%; font-size:20px; font-weight:bold;}
.caseinfo .blk40{ height:0px;}
.caseinfo .btnmore {width: 100%;}

.caseinfotop1{ width:100%; padding-left:5%; padding-right:5%;}
.caseinfotop2{ width:100%; padding-left:5%; padding-right:5%;}
.caseinfotop i{ font-size:20px; padding-top:10px; display:none;}
.caseinfotop p{ font-size:12px; padding:10px 0 10px;}
.caseinfotop span{ padding-top:10px; font-size:10px}

.caseinfotop .fangwen{width:88px; height:17px; margin-top:10px;}
.caseinfobot a{ color:#444;}
.caseinfobot ul li{ float:left; width:33%;}
.caseinfobot ul li:nth-of-type(1){ text-align:left; padding-left:5%; padding-top:35px; }
.caseinfobot ul li:nth-of-type(2){ text-align:center; padding-top:30px;padding-bottom:30px;}
.caseinfobot ul li:nth-of-type(3){ text-align:right; padding-right:5%; padding-top:35px;}
.caseinfobot .fanhui a{width:32px; height:32px; background-size:100% 200%;  }
.caseinfobot .fanhui a:hover{ background-position:0 -32px; background-size:100% 200%; }
.zi{ display:none;}
}



/*.case-content li:nth-of-type(3n){margin-right: 0;}}*/

.service{ background:#FFF;position:relative; z-index:2; width:1180px; margin:-60px auto 30px;}
.service img{ max-width:100%;}
.service p{ font-size:30px; color:#333; width:75%; margin:0 auto; padding:80px 0 55px 0;}
.service-content .servicecon li{width: 100%; *width:99.95%!important;height:590px; overflow:hidden; }
.service-content .servicecon li a:hover img{-o-opacity:0.6;opacity:0.6;-moz-opacity:0.6;-ms-opacity:0.6;-webkit-opacity:0.6;filter:alpha(opacity=60);}
.service-content .servicecon li:nth-of-type(1){ background-color:#FFB71F;}
.service-content .servicecon li:nth-of-type(2){ background-color:#10AF5D;}
.service-content .servicecon li:nth-of-type(3){ background-color:#0050ff;}
.service-content .servicecon li:nth-of-type(4){ background-color:#C01C23;}
.service-content .servicecon li .service-col{ width:590px; height:590px;}
.service-content .servicecon li a{color:#FFF; text-align:center; display:block}
.service-content .servicecon li a h3{ font-size:39px; font-weight:normal; padding-top:220px;}
.service-content .servicecon li a span{ font-size:16px; display:block; line-height:1.8; padding-bottom:10px;}
.service .w1200 h2{ font-size:40px; font-style:normal; line-height:1;font-family: Pincolor; }


@media screen and (max-width:768px){
.service{margin-top:-15px; margin-bottom:20px; width:92%;}
.service p{ font-size:14px; padding:30px 0 20px 0;}
.service-content .servicecon{ padding-bottom:20px;}
.service-content .servicecon li{width: 100%; *width:99.95%!important; height:100%; }
.service-content .servicecon li div{width: 100%; *width:99.95%!important; height:100%; float:none; }
.service-content .servicecon li a h3{ font-size:20px;  padding-top:100px;}
.service-content .servicecon li a span{ font-size:12px;padding-bottom:10px;}
.service-content .servicecon li a h4{  padding-bottom:100px;}
.service-content .servicecon li .service-col{ width: 100%; *width:99.95%!important;}
.service .w1200 h2{ font-size:20px; font-style:normal; line-height:1;font-family: Pincolor; }
}








@media only screen and (max-width:720px) and (min-width:0px){
	
	
	
.serlist2 .serlist21 ul li{ width:50%; }
.serlist2 .serlist22 .serlist22l,.serlist2 .serlist22 .serlist22r{ width:100%; padding-top:30px; padding-bottom:30px;}
.mob_tit{ font-size:20px; padding:30px 0 0; display:none}
.mob_list{ width:100%;  padding:10px 0 00px; display:none}
.mob_list ul li{ width:100%;}
.mob_list ul li a{ display:block; width:334px; height:637px; color:#333;background:url(pin2016/sj_bg.png) no-repeat left; text-align:center; margin:0 auto;}
.mob_list ul li a:hover{ background-position:-334px 0; color:#1D8DFA;}
.mob_list ul li a h2{ font-size:27px; padding-top:140px; margin-bottom:30px;}
}
.sj-sjcase{ width:370px; margin:0 auto; z-index:30;}	
.sj-sjcase img{width:100%; display:block;}
.sj{ background:url(pin2016/sj-bj.jpg) repeat; width:100%; height:980px;}
.sjl,.sjr{ width:50%; position:relative; color:#FFF;}
.sjl .sjtu{ margin-top:160px;}
.sj-top{ left:86px; top:165px; z-index:40;}
.sj-case{ left:80px; top:90px; z-index:5;}
.sjr{padding-top:240px; padding-left:50px;line-height:1.2}
.sjr .title{ font-size:42px; padding-right:50px;}
.sjr .p1{ font-size:32px;}
.sjr .p2{ font-size:20px; padding-bottom:30px;}
.sj-ewm{ margin:15px 0 20px 0;}
.sjhide{ display:block;}
.sjshow{ display:none;}
@media only screen and (max-width:720px) and (min-width:0px){
.sj{ display:none;}
.sj-sjcase{ display:block;}	

.sjhide{ display:none;}
.sjshow{ display:block;}
}

/*fast*/
.fastmsgbox{width:1080px; height:600px; display:none; padding:5em; background:rgba(255,255,255,0.98);*background:#FFF; font-size:14px; color:#222;}
.fastmsgbox .msg_zixun{width:49.9%; float:left;}
.fastmsgbox h3{ font-size:3.5em; padding:0 0 0px; line-height:1.3;color:#333;}
.fastmsgbox p{ font-size:1.2em; padding:0 0 0em;}
.fastmsgbox h4{font-size:1.6em; padding:1em 0 0.5em;color:#333;}
.fastmsgbox .msg_zixun input,.fastmsgbox .msg_zixun textarea{font-size:1.2em; padding:1em; border:1px solid #DDD; width:99%; margin-bottom:0.5em;}
.fastmsgbox .msg_zixun textarea{height:5.2em;}
.fastmsgbox .msg_zixun input.submit{font-size:1.2em; padding:1em 0.8em; background:#0050ff; color:#FFF; border:1px solid #0050ff; width:99%; cursor:pointer;}
.fastmsgbox .msg_zixun input.submit:hover{ background:#49D160;border:1px solid #49D160; }
.fastmsgbox .msg_zixun img{float:left; margin-right:1.2em;}
.fastmsgbox .msg_zixun em{font-size:1.2em;}
.fastmsgbox .msg_zixun i{font-size:1.2em; padding:2em 0 0; font-weight:bold; display:inline-block;}